<template>
    <div class='container'>
        <el-form :model="ruleForm" ref="ruleForm" :rules="rules" :label-position="labelPosition" label-width="150px" class="demo-ruleForm">
        <div v-show="showForm">
            <div class="container" style="margin-top:20px">
                <h3 style="margin-bottom: 20px">{{title}}</h3>
				<el-row>
					<el-col>
						<el-form-item label="原料类型：" >
					    <!-- <el-radio-group  label="原料类型"> -->
					       {{ruleForm.type}}
					    <!-- </el-radio-group> -->
					</el-form-item>
					</el-col>

				</el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="标准类型：" v-if="ruleForm.type == '配方颗粒(颗粒)'">
                            {{standard}}
                        </el-form-item>
                        <el-form-item label="标准名称：">
                            {{ruleForm.checkName}}
                        </el-form-item>

                        <el-form-item label="检验标准文件：" style="width:500px" v-if="ifshow">
                            <img :src="imgurl" alt="" style="width:200px;height:200px;">
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="检验标准描述：">
                            {{ruleForm.description}}
                        </el-form-item>
                    </el-col>
                </el-row>
            </div>
            <el-form-item class="footerFixed">
                <el-button type="primary" @click="submitForm()">确认无误</el-button>
                <el-button @click="editback">返回修改</el-button>
            </el-form-item>
        </div>
        <div v-show = "show">
            <div class="container" style="margin-top:20px">
                <h3 style="margin-bottom: 20px">{{title}}</h3>
                <el-row>
                    <el-form-item label="原料类型：" prop="materialType">
                        <el-radio-group v-model="ruleForm.type" >
                            <el-radio label="中药材" border>中药材</el-radio>
                            <el-radio label="辅料" border>辅料</el-radio>
                            <el-radio label="提取饮片" border>提取饮片</el-radio>
							 <el-radio label="配方颗粒(浸膏粉)" border>配方颗粒(浸膏粉)</el-radio>
                            <el-radio label="配方颗粒" border>配方颗粒</el-radio>
                            <el-radio label="配方颗粒(颗粒)" border>配方颗粒(颗粒)</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-row>
                <el-row>

                    <el-col :span="12">
                        <el-form-item label="* 标准类型：" prop="standard" v-if="ruleForm.type == '配方颗粒(颗粒)'">
                            <el-select v-model="ruleForm.standard"  filterable disabled placeholder="请选择" style="width: 300px;">
                                <el-option label="国标" value="1"></el-option>
                                <el-option label='省标' value="2"></el-option>
                                <el-option label='省标-北京' value="3"></el-option>
                                <el-option label='省标-上海' value="4"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="标准名称：" prop="checkName">
                            <el-input placeholder="请输入内容" v-model.trim="ruleForm.checkName" style="width:300px">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="检验标准文件："  style="width:500px">
                            <upload-img ref="uploadChang" :maxNum="1" :files='listUrl'></upload-img>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                       <el-form-item label="检验标准描述：" >
                            <el-input placeholder="请输入内容"  v-model.trim="ruleForm.description" style="width:300px">
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </div>
            <el-form-item class="footerFixed">
                <el-button type="primary" @click="submitrule('ruleForm')">提交</el-button>
                <el-button @click="backPage">返回</el-button>
            </el-form-item>
        </div>
        </el-form>
    </div>
</template>

<script>
import {check_save,check_findById,check_update} from '@/request/api'
import uploadImg from '../../../common/uploadImg';
    export default {
        components: {
            uploadImg
        },
        data() {
            return {
                standard:'',
				title:'',
                ifshow:true,
                imgurl:'',
                show:true,
                labelPosition:'right',
                showForm: false,
                ruleForm: {
                    type:'',
                    description:'',
                    checkName:'',
                    basis:[],
                    // files:''
                },
                listUrl:'',
                id:'',
                rules:{
                    standard:[
                        { required: true, message: '不能为空', trigger: 'change' }
                    ],
                    checkName: [
                        { required: true, message: '不能为空', trigger: 'change' }
                    ],

                },
                // standard:'1'
            };
        },
        mounted(){
			// console.log(this.$route)
			if(this.$route.path == "/checkingBasis/added"){
				this.title = "新增检验检测"
				// console.log(111)
			}
			if(this.$route.path == "/checkingBasis/edit"){
				this.title = "编辑检验检测"
				// console.log(222)
			}
            this.id= this.$route.query.id
            this.ruleForm.type = this.$route.query.type
            this.ruleForm.companyId = this.$route.query.sid
            this.ruleForm.standard = this.$route.query.standard
            if(this.id == undefined){

            }else{
                this.init()
            }
        },
        methods: {
            editback(){
                this.show = true
                this.showForm = false
            },
            init(){
                check_findById(this.id).then((res)=>{
                    this.ruleForm = res.data
                    this.ruleForm.oldBasis = res.data.basis
                    const arr = this.ruleForm.basis.split(";")
                    if(arr == ""){

                    }else{
                        this.listUrl = arr.map(t =>{
                            var obj = {}
                            obj.url =this.$store.state.imageUrls + t
                            obj.name = this.$store.state.imageUrls + t
                            return obj
                        })
                    }
                })
            },
            deleteUnit(index){
                this.$confirm('是否确定删除该条工艺描述?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.units.splice(index,1)
                        this.$notify({
                            title: '提示',
                            message: '删除成功',
                            type: 'success',
                            duration:1000
                        });
                    }).catch(() => {
                        this.$notify({
                            title: '提示',
                            message: '已取消删除',
                            type: 'info',
                            duration:1000
                        });
                    });
            },
            backPage () {
                this.$router.go(-1);
                this.$store.commit('settype',this.ruleForm.type)
                this.$store.commit('setsid',this.ruleForm.companyId)
            },
            submitForm() {
                var imgurls = this.$refs.uploadChang.fileList
                let formdata = new FormData()
                var arr=""
                for(var i=0;i<imgurls.length;i++){
                    if(imgurls[i].status != "success"){
                        formdata.append("files",imgurls[i].raw)
                    }
                   arr += imgurls[i].name + ';'
                }
                var str = arr.substr(0,arr.length-1)
                this.ruleForm.basis = str.substring(str.lastIndexOf("/")+1)
                for(var a in this.ruleForm){
                    if(this.ruleForm[a] == null || this.ruleForm[a] == "null"){
                        this.ruleForm[a] = ""
                        formdata.append(a,'')
                    }else{
                        formdata.append(a,this.ruleForm[a])
                    }
                }
                if(this.id == undefined){
                    check_save(formdata).then((res)=>{
                        this.$notify({
                            title: '提示',
                            message: '保存成功',
                            type: 'success',
                            duration:1000
                        });
                        this.backPage()
                    })
                }else{
                    check_update(formdata).then((res)=>{
                        this.$notify({
                            title: '提示',
                            message: '修改成功',
                            type: 'success',
                            duration:1000
                        });
                        this.backPage()
                    })
                }
            },
            submitrule(formName){
                if(this.ruleForm.standard == 1){
                    this.standard = "国标"
                }else if(this.ruleForm.standard == 2){
                     this.standard = "省标"
                }else if(his.ruleForm.standard == 3){
                    this.standard = "省标-北京"
      			}else if(his.ruleForm.standard == 4){
                    this.standard = "省标-上海"
      			}

                if(this.$refs.uploadChang.fileList.length>0){
                    this.imgurl = this.$refs.uploadChang.fileList[0].url
                }else{
                    this.imgurl = ""
                }
                if(this.imgurl == ""){
                    this.ifshow = false
                }else{
                    this.ifshow = true
                }

                this.$refs[formName].validate((valid)=>{
                    if(valid){
                        this.showForm= true
                        this.show = false
                    }else{
                        return false
                    }
                })
            }

        }
    }
</script>
<style scoped lang="less">
.delete_btn{
    margin-left:6px;
}
</style>
